/* 尽量不要拿框架已有的类名来改样式，可能会影响其他地方的样式 */
body{
    display: flex;
    align-items: center;
    justify-content: center;
    /* 竖直没居中，因为body的高度没撑开为100vh，默认由内容.my-login的内容撑开 */
    height: 100vh;
}
.my-login{
    width: 320px;   
}
.my-login .panel-heading{
    text-align: center;
    font-size: 20px;
    /* 不需要再起个类名，通过外层父容器名限制选择器 */
}

.my-login .panel-footer{
    display: flex;
    justify-content: space-between;
}